<template>
	<uni-card spacing="0" margin="0" :is-shadow="false" :border="false">
		<uni-section title="活动附件图片" type="line">
			<acImage v-model:imageList="imageList" :maxNumber="9" :editShow="true" @uploadImg="uploadImg" @imgDelete="imgDelete" />
		</uni-section>
	</uni-card>
	<view class="p10">
		<button @click="submit" type="default" class="basicbutton m10" hover-class="basicbutton-hover">返回参建项目列表</button>
	</view>
</template>

<script lang="ts" setup>
	import acImage from "@/pages/student/user/a-components/ac-image.vue";
	import { getUser } from "@/utils/storage"
	import { projectUpload, projectFileDelete } from "@/api/user"
	import { ref } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	
	let userData = getUser()
	let itemID = ref('')
	let imageList = ref([])

	onLoad((option) => {
		itemID.value = option.itemID || ''
	});
	
	// 上传图片
	function uploadImg(filePath) {
		projectUpload({
			filePath: filePath,
			formData: {
				jobseekerId: userData.userId,
				projectId: itemID.value
			},
		}).then(res => {
			let list = res.data || []
			list.forEach(item => {
				item.url = item.thumbnail
			})
			imageList.value = list
		}).catch(err => {
		})
	}
	// 删除图片
	function imgDelete(id) {
		projectFileDelete({
			attachmentId: id,
			jobseekerId: userData.userId,
			projectId: itemID.value
		}).then(res => {
			if (res.code == '200') {
				let list = imageList.value
				let num = list.findIndex(v => v.id === id);
				list.splice(num, 1);
				imageList.value = list
			}
		}).catch(err => {
		})
	}

	function submit() {
		uni.navigateBack({
			delta: 1
		})
	}
</script>

<style lang="scss" scoped>
	.img-dom {
		margin: 0 10px 10px 0;

		.img-item {
			width: 100px;
			height: 100px;
			border-radius: 6rpx;
		}

		.img-bnt {
			position: relative;
			top: -24px;
			border-radius: 0 0 6rpx 6rpx;
			background: rgba(0, 0, 0, 0.3);
			line-height: 1;

			.img-bnt-item {
				flex: 1;
				text-align: center;
			}
		}
	}

	.img-add {
		width: 100px;
		margin: 0 10px 10px 0;
		height: 100px;
		border-radius: 6rpx;
		border: 1px solid #eee;
		text-align: center;
		line-height: 100px;
	}
</style>